// 不知道干啥
// import { css } from "styled-components";

export const color = {
	// Palette
	primary: "#FF4785",
	secondary: "#1EA7FD",
	tertiary: "#DDDDDD",

	orange: "#FC521F",
	gold: "#FFAE00",
	green: "#66BF3C",
	seafoam: "#37D5D3",
	purple: "#6F2CAC",
	ultraviolet: "#2A0481",

	// Monochrome
	lightest: "#FFFFFF",
	lighter: "#F8F8F8",
	light: "#F3F3F3",
	mediumlight: "#EEEEEE",
	medium: "#DDDDDD",
	mediumdark: "#999999",
	dark: "#666666",
	darker: "#444444",
	darkest: "#333333",

	border: "rgba(0,0,0,.1)",

	// Status
	positive: "#66BF3C",
	negative: "#FF4400",
	warning: "#E69D00",
};

export const background = {
	app: "#F6F9FC",
	appInverse: "#7A8997",
	positive: "#E1FFD4",
	negative: "#FEDED2",
	warning: "#FFF5CF",
};

export const typography = {
	type: {
		primary:
			'"Nunito Sans", "Helvetica Neue", Helvetica, Arial, sans-serif',
		code://书写字体
			'"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace',
	},
	weight: {
		regular: "400",
		bold: "700",
		extrabold: "800",
		black: "900",
	},
	size: {
		s1: "12",
		s2: "14",
		s3: "16",
		m1: "20",
		m2: "24",
		m3: "28",
		l1: "32",
		l2: "40",
		l3: "48",
	},
};

export const spacing = {
	padding: {
		small: 10,
		medium: 20,
		large: 30,
	},
	borderRadius: {
		small: 5,
		default: 10,
	},
};

export const breakpoint = 600;

export const pageMargin = 5;